{% extends "xadmin/base_site.html" %}
{% load i18n %}
{% load url from future %}
{% load xadmin_tags %}
{% load crispy_forms_tags %}

{% block breadcrumbs %}
{% if account_view %}
<ul class="breadcrumb">
  <link href="/websys/static/xadmin/vendor/bootstrap-table/css/bootstrap-table.min.css" type="text/css" media="screen" rel="stylesheet" />
<li><a href="{% url 'xadmin:index' %}">{% trans 'Home' %}</a></li>
  <li class="active">{% trans '代理局数统计' %}</li>
</ul>
{% else %}
<ul class="breadcrumb">
  <li><a href="{% url 'xadmin:index' %}">{% trans 'Home' %}</a></li>
  <li>
    {% if has_view_permission %}
    <a href="{% url opts|admin_urlname:'changelist' %}">{{ opts.verbose_name_plural|capfirst }}</a>
    {% else %}{{ opts.verbose_name_plural|capfirst }}{% endif %}
  </li>
  <li><a href="{% url opts|admin_urlname:'change' original.pk %}">{{ original|truncatewords:"18" }}</a></li>
  <li class="active">{% trans 'Change password' %}</li>
</ul>
{% endif %}
{% endblock %}

{% block content-nav %}
{% endblock %}
{% block content %}
<!--页面设计在这儿....{{ serverval }}-->
    <style>
    .tb_tr{height: 50px; border:gainsboro 1px  double;}
    .tb_td{height: 50px; border: gainsboro 1px double; width:80px;}
    </style>
    <table style="width: 100%">
        <tr class="tb_tr" id="tr_year" style="display: none;">
            <td class="tb_td">年份：</td>
            <td>
                <input type="text" id="year_0" class="datepicker" placeholder="请选择年份" />
                到
                <input type="text" id="year_1" class="datepicker" placeholder="请选择年份" />
            </td>
        </tr>
        <tr class="tb_tr" id="tr_month" style="display: none;">
            <td class="tb_td">月份：</td>
            <td>
                <input type="text" id="month_0" class="datepicker" placeholder="请选择月份" />
                到
                <input type="text" id="month_1" class="datepicker" placeholder="请选择月份" />
            </td>
        </tr>
        <tr class="tb_tr" id="tr_day">
            <td class="tb_td">日期：</td>
            <td>
                <input type="text" id="day_0" class="datepicker" placeholder="请选择日期" />
                到
                <input type="text" id="day_1" class="datepicker" placeholder="请选择日期" />
            </td>
        </tr>
        <tr class="tb_tr">
            <td class="tb_td">方式：</td>
            <td>
                <input type="radio" id="r_2" value="2" name="r_type" onclick="setType(2)" checked="true">按日&nbsp; &nbsp;&nbsp;&nbsp;
                <input type="radio" id="r_1" value="1" name="r_type" onclick="setType(1)">按月&nbsp; &nbsp;&nbsp;&nbsp;
                <input type="radio" id="r_0" value="0" name="r_type" onclick="setType(0)">按年&nbsp; &nbsp;&nbsp;&nbsp;
            </td>
        </tr>

    <tr class="tb_tr">
            <td class="tb_td"></td>
            <td><label id="la_link"> {{links}}</label>&nbsp;&nbsp;<input type="button" id="bt_copy" value="查询" onclick="toSearch()"></td>
        </tr>
    <tr class="tb_tr">
            <td class="tb_td" colspan="2">
                <table data-toggle="table" data-height="100%"  data-pagination="true" id="table_report" style="">

                </table>
            </td>
    </tr>
    </table>
<script type="text/javascript" src="/websys/static/xadmin/vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
    <script src="/websys/static/xadmin/vendor/bootstrap-datepicker/js/locales/bootstrap-datepicker.zh-CN.js"></script>
    <script src="/websys/static/xadmin/vendor/bootstrap-table/js/bootstrap-table.min.js"></script>
    <script src="/websys/static/xadmin/vendor/bootstrap-table/js/bootstrap-table-locale-all.min.js"></script>
    <script>
    var dateType=new Array('year','month','day');
    var dateName={'year':'年份','month':'月份','day':'日期'};
    var curType='day';
    function setType(val)
    {//alert(val);
        for(var ii=0;ii<dateType.length;ii++)
        {
            if(ii==val)
            {
                $('#tr_'+dateType[val]).css('display', '');
            }
            else
            {
                $('#tr_'+dateType[ii]).css('display', 'none');
            }
            curType=dateType[val];
        }
    }
    function setDay()
    {//alert('month');
        for(var ii=0;ii<2;ii++) {
            $("#day_"+ii).datepicker({
                language: "zh-CN",
                autoclose: true,//选中之后自动隐藏日期选择框
                clearBtn: true,//清除按钮
                //todayBtn: true,//今日按钮
                startView: 'days',
                maxViewMode: 'days',
                minViewMode: 'days',
                format: "yyyy-mm-dd"//日期格式，详见 http://bootstrap-datepicker.readthedocs.org/en/release/options.html#format
            });
            $("#day_"+ii ).datepicker( 'setDate' , new Date());
        }
    }
    function setMonth()
    {//alert('month');
        for(var ii=0;ii<2;ii++) {
            $("#month_"+ii).datepicker({
                language: "zh-CN",
                autoclose: true,//选中之后自动隐藏日期选择框
                clearBtn: true,//清除按钮
                //todayBtn: true,//今日按钮
                startView: 'months',
                maxViewMode: 'months',
                minViewMode: 'months',
                format: "yyyy-mm"//日期格式，详见 http://bootstrap-datepicker.readthedocs.org/en/release/options.html#format
            });
            $("#month_"+ii ).datepicker( 'setDate' , new Date());
        }
    }
    function setYear()
    {
        for(var ii=0;ii<2;ii++)
        {
            $("#year_"+ii).datepicker({
                language: "zh-CN",
                autoclose: true,//选中之后自动隐藏日期选择框
                clearBtn: true,//清除按钮
                //todayBtn: true,//今日按钮
                startView: 'years',
              maxViewMode:'years',
              minViewMode:'years',
                //defaultDate : '2017',
                format: "yyyy"//日期格式，详见 http://bootstrap-datepicker.readthedocs.org/en/release/options.html#format
            });
            //$("#year_"+ii).datepicker("setDate", '2017');
            $("#year_"+ii ).datepicker( 'setDate' , new Date());
        }

    }

    $(function () {
        setYear();
        setMonth();
        setDay();

        $(".date-picker").datepicker({
                language: "zh-CN",
                autoclose: true,
            });
    });

    function toSearch() {
        //var t0=$("#date_0").datepicker("getDate").toLocaleString();//获取
        //$(".datepicker").datepicker("setDate", '2014-01-25');//设置
        var t0 = $("#" + curType + "_0").val(), t1 = $("#" + curType + "_1").val();
        function getDay(date) {
            return date.getDay();
            var week;
            if(date.getDay()==0) week="周日";
            if(date.getDay()==1) week="周一";
            if(date.getDay()==2) week="周二";
            if(date.getDay()==3) week="周三";
            if(date.getDay()==4) week="周四";
            if(date.getDay()==5) week="周五";
            if(date.getDay()==6) week="周六";
            return week;
        }
        function getDays(strDateStart,strDateEnd){
            var strSeparator = "-"; //日期分隔符
            var oDate1;
            var oDate2;
            var iDays;
            oDate1= strDateStart.split(strSeparator);
            oDate2= strDateEnd.split(strSeparator);
            var strDateS = new Date(oDate1[0], oDate1[1]-1, oDate1[2]);
            var strDateE = new Date(oDate2[0], oDate2[1]-1, oDate2[2]);
            iDays = parseInt(Math.abs(strDateS - strDateE ) / 1000 / 60 / 60 /24)//把相差的毫秒数转换为天数
            return iDays ;
        }
        function checkDays(week,days) {
            if(week =='周一' && days==6)
            {alert('您是按周查询')}
            else
            {alert('您是按天查询')}
        }
        var week =getDays(t0,t1);
        var w1 =getDay(new Date(t0));
        var t2 = $("input[name='r_type']:checked").val();
        /*
        if(t2==2 && (w1 !=1 || week !=6))//week not 1
        {
            alert('请选择正确周期');
                return;
            }*/
        //alert(t0+"-"+t1+"开发中。"+t2);//data-url="/websys/static/data2.txt"
        var turl = '/xadmin/report/my_gathers';//?date='+t0+','+t1+'&type='+t2;
        if (t0 == '' || t1 == '') {
            alert('日期不能为空');
            return;
        }
        $('#table_report').bootstrapTable('destroy'); // 显示之前，先把当前表格销毁
        $('#table_report').bootstrapTable({
            //search: true,
            locale: 'zh-CN',//中文支持
            sortable: true,      //是否启用排序
            showFooter: true,
            sortName: 'date',
            //showRefresh: true,
            pagination: true,//是否开启分页（*）
            pageNumber: 1,//初始化加载第一页，默认第一页
            pageSize: 10,//每页的记录行数（*）
            pageList: [10, 20, 50],//可供选择的每页的行数（*）
            method: "get",         // 经过测试，只有post方法能发给后端的helloWorld.do
            showExport: true,                     //是否显示导出
            exportDataType: "basic",              //basic', 'all', 'selected'.
            sidePagination: 'server',
            queryParamsType: '', //默认值为 'limit' ,在默认情况下 传给服务端的参数为：offset,limit,sort
            // 设置为 ''  在这种情况下传给服务器的参数为：pageSize,pageNumber
            queryParams: function (params) {
                return {
                    //meterID: $('#meterid').val(),
                    pageSize: params.pageSize,
                    //offset: params.offset,
                    pageNumber: params.pageNumber,
                    sortOrder: params.order,
                    sort: params.sort, //排序列名
                    date: t0 + ',' + t1,
                    type: t2
                }
            },

            url: turl,   // 发送到后端helloWorld.do，由helloWorld.do返回json字符串，
            // 必须是列表形式，例如：[{"name":"aaa","id":"kkk"},{...},...]
            columns: [{              // 定义过滤的字符串，只有columns里写的才显示，其它不显示
                field: 'date',        // 这里是需要显示的字段的key,也就是helloWorld.do返回json字符串
                // 中必须有这个key,以及对应的value
                title: eval('dateName.' + curType),         // 在页面显示的该列的标题信息
                footerFormatter: '合计'
            },
                {
                    field: 'time_15',
                    title: '15分钟局数',
                    footerFormatter: function (value) {
                        var count = 0;
                        for (var i in value) {
                            count += value[i].time_15;
                        }
                        if (count <= 0) {
                            //return "0";
                        }
                        return count;
                    }
                },
                {
                    field: 'time_20',
                    title: '20分钟局数',
                    footerFormatter: function (value) {
                        var tcount = 0;
                        for (var i in value) {

                            tcount += value[i].time_20;
                        }

                        if (tcount <= 0) {
                            //return "0";
                        }
                        return tcount;
                    }
                },
                                {
                    field: 'time_30',
                    title: '30分钟局数',
                    footerFormatter: function (value) {
                        var tcount = 0;
                        for (var i in value) {

                            tcount += value[i].time_30;
                        }

                        if (tcount <= 0) {
                            //return "0";
                        }
                        return tcount;
                    }
                },
                                                {
                    field: 'time_60',
                    title: '60分钟局数',
                    footerFormatter: function (value) {
                        var tcount = 0;
                        for (var i in value) {

                            tcount += value[i].time_60;
                        }

                        if (tcount <= 0) {
                            //return "0";
                        }
                        return tcount;
                    }
                },
                {
                    field: 'total_number',
                    title: '总局数',
                    footerFormatter: function (value) {
                        var tcount = 0;
                        for (var i in value) {

                            tcount += value[i].total_number;
                        }

                        if (tcount <= 0) {
                            //return "0";
                        }
                        return tcount;
                    }
                },
                {
                    field: 'allmoney',
                    title: '总金额',
                    footerFormatter: function (value) {
                        var tcount = 0;
                        for (var i in value) {

                            tcount += value[i].allmoney;
                        }

                        if (tcount <= 0) {
                            //return "0";
                        }
                        return tcount.toFixed(2);
                    }
                }
            ]

        });
         /*
        $table.bootstrapTable('load', data);
        $('#table_report').bootstrapTable({
                url: 'http://127.0.0.1:8080/xadmin/report/recharge?date='+t0+','+t1+'&type='+t2
            });*/
    }
{#    function format_html()#}
{#    {#}
{#    var my_cid='';#}
{##}
{#	$.get('/xadmin/sysoper/agentclassid/', function(result){#}
{#			my_cid=result.ret;#}
{#			//alert(my_cid);#}
{#			if(my_cid<100){#}
{#			    alert('0');#}
{#			    $('#username').css('display', '');#}
{#			}#}
{#			else//隐藏平台列，跟从上级的#}
{#			{#}
{##}
{#			}#}
{#	    },'json');#}
{#    }#}
{#    format_html();#}
    </script>
{% endblock %}